<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" >
<head>
	<title th:text="${'文章列表 - 太易云'}"></title>
	<link th:href="@{/img/logo.png}" rel="shortcut icon"></link>
	<meta name="keywords" th:content="太易文章" />
	<meta name="description" th:content="太易文章"/>
	<!-- detail-ui dependcise-->
	<link th:href="@{/vender/detail-ui/css/bootstrap/bootstrap.css}" rel="stylesheet" />
	<link th:href="@{/vender/detail-ui/css/bootstrap/bootstrap-overrides.css}" type="text/css" rel="stylesheet" />
	<link th:href="@{/vender/detail-ui/css/compiled/layout.css}" rel="stylesheet" type="text/css"  />
	<link th:href="@{/vender/detail-ui/css/elements.css}" rel="stylesheet" type="text/css"  />
	<link th:href="@{/vender/detail-ui/css/icons.css}" rel="stylesheet" type="text/css"  />
	<link th:href="@{/vender/detail-ui/css/lib/font-awesome.css}" rel="stylesheet" type="text/css" />
	<link th:href="@{/vender/detail-ui/css/lib/select2.css}" rel="stylesheet" type="text/css"/>
	<link th:href="@{/vender/detail-ui/css/compiled/tables.css}" rel="stylesheet" type="text/css"  />
	<link th:href="@{/vender/detail-ui/css/compiled/form-showcase.css}" rel="stylesheet" type="text/css"/>
	<link th:href="@{/vender/detail-ui/css/compiled/gallery.css}" rel="stylesheet" type="text/css"/>
	<link th:href="@{/vender/detail-ui/css/compiled/skins/dark.css}" rel="stylesheet" type="text/css"/>
	<link th:href="@{/vender/layer/3.0.3/skin/default/layer.css}" rel="stylesheet" type="text/css"/>
	<link th:href="@{/vender/bootstrap-treeview/1.2.0/bootstrap-treeview.min.css}" rel="stylesheet" type="text/css"/>
	<link th:href="@{/vender/bootstrap-datetimepicker/2.0/css/bootstrap-datetimepicker.min.css}" rel="stylesheet" type="text/css"/>
	<link th:href="@{/vender/unslider/2.0.3/css/unslider.css}" rel="stylesheet" type="text/css"/>
	<link th:href="@{/vender/unslider/2.0.3/css/unslider-dots.css}" rel="stylesheet" type="text/css"/>
	<link th:href="@{/css/iconfont.css}" rel="stylesheet" type="text/css"/>
	<!-- teops css -->
	<link th:href="@{/css/detail.overwrite.css}" rel="stylesheet" type="text/css"/>
	<link th:href="@{/css/main.css}" rel="stylesheet" type="text/css"/>
</head>
<body >
<header class="navbar navbar-inverse" role="banner" id="top-nav">
	<a class="navbar-brand" th:href="@{/home}"><img th:src="@{/img/logo2.png}"/></a>
</header>
<div class="row section">
	<div class="col-md-3"></div>
	<div class="col-md-6">
		<div class="col-md-12 article-list">
			<div class="row article-row" th:each="article: ${articles}">
				<div class="col-md-3">
					<a th:href="${article.url}"><img class="article-img" th:src="@{${article.imgUrl}}"></img></a>			
				</div>
				<div class="col-md-9">
					<div class="col-md-12">
						<a class="article-title" th:href="${article.url}" th:text="${article.title}"></a>
					</div>
					<div class="col-md-12">
						<a class="article-description" th:href="${article.url}" th:text="${article.description}"></a>
					</div>
					<div class="col-md-12">
						<span class="article-tag" th:each="tag: ${article.tags}" th:text="${tag}">标签</span>
					</div>
					<div class="col-md-12">
						<span class="article-editor" >作者:<span th:text="${article.editor}"></span></span>
					</div>
					<div class="col-md-12">
						<span class="article-editor" ><span th:text="${article.date}"></span></span>
					</div>
				</div>
			</div>
		</div>
		<div class="row">
			<nav aria-label="Page navigation">
			  <ul class="pagination" th:if="${pageTotal lt 0}">
			    <li  th:each="i : ${#numbers.sequence(0,pageTotal-1)} " th:class="${ (i+1) eq pageNum } ? 'active'">
			    	<a th:href="@{${'/articles?pageNum='+(i+1)}}" th:text="${i+1}"></a>
			    </li>
			  </ul>
			</nav>
		</div>
	</div>
	<div class="col-md-3"></div>
</div>

<div th:include="js-dependcise :: basic"></div>
<script th:src="@{/js/components/side-nav.js}" type="text/babel"></script>
<script th:src="@{/js/main.js}" type="text/babel" ></script>
<script type="text/babel">

</script>
<div th:include="js-dependcise :: detail-ui"></div>
<footer th:include="footer :: foot"></footer>
</body>
</html>